//
// Variables
// --------------------------------------------------

//== Font
@font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;

@prefix: yo-;


@default:#0a9fad;  //默认主题色
@default-plain:#bfd4fc;  //默认主题色
@default-bc:#f2f7ff;  //默认背景色
@primary:#0a9fad; //主要颜色
@primary-border:#0a9fad; //主要颜色
@primary-plain:#c0dcf8; 
@primary-plain-bc:#f0f7fe; 
@success:#19be6b;//成功颜色
@success-border:#02aa56;//成功颜色
@success-plain:#77be9b;//成功颜色
@success-plain-bc:#caf8e1;//成功颜色
@info:#2db7f5;//信息颜色
@info-border:#0bacf7;//信息颜色
@info-plain:#9cdbf8;//信息颜色
@info-plain-bc:#c6ecfe;//信息颜色
@warning:#f90;//警告颜色
@warning-border:#f3a735;//警告颜色
@warning-plain:#fac980;//警告颜色
@warning-plain-bc:#fcedd6;//警告颜色
@error:#ed4014;//错误颜色
@error-border:#e03206;//错误颜色
@error-plain:#e78870;//错误颜色
@error-plain-bc:#facdc2;//错误颜色

@bg-disabled:#f7f7f7;//背景不可用颜色
@font:  #515a6e;//默认字体颜色
@font-disabled:#c5c8ce;// 文字不可用颜色 
@border:#d7dde4;// 默认边框颜色
@border-disabled:#dcdee2;// 默认边框颜色


//** 灰阶
@gray0:                 #000;
@gray1:                 #111;
@gray2:                 @gray1 * 2;     // #222
@gray3:                 @gray1 * 3;     // #333
@gray4:                 @gray1 * 4;     // #444
@gray5:                 @gray1 * 5;     // #555
@gray6:                 @gray1 * 6;     // #666
@gray7:                 @gray1 * 7;     // #777
@gray8:                 @gray1 * 8;     // #888
@gray9:                 @gray1 * 9;     // #999
@grayA:                 @gray1 * 10;    // #aaa
@grayB:                 @gray1 * 11;    // #bbb
@grayC:                 @gray1 * 12;    // #ccc
@grayD:                 @gray1 * 13;    // #ddd
@grayE:                 @gray1 * 14;    // #eee
@grayF:                 #fff;
@gray-highlight:        #f7f7f7;
@gray-highlight2:       #f0f0f0;

//** 灰阶

// 背景色 body
@body-bg:               #F2F2F2;
// @body-bg:               #fff;

// 全局文字颜色 body
@text-color:            @gray6;
@line-c:                 #dfdfdf; //线条颜色

// 文字颜色
@dark:                  @gray0;
@gray-dark:             @gray3;
@gray:                  @gray6;
@gray-light:            @gray9;
@gray-lighter:          @grayC;
@white:                 @grayF;
@green-dark:            #4bb1bd;
@blue:                  #29a4e2;
@blue-light:            #6cf;
@blue-lighter:          #bef;
@orange:                #ffc456;
@red:                   #f00;

// 阴影

@tran:         transparent;
@tran2:        rgba(0, 0, 0, .0);
@sd-gray1:     rgba(0, 0, 0, .1);
@sd-gray2:     rgba(0, 0, 0, .2);
@sd-gray3:     rgba(0, 0, 0, .3);
@sd-gray4:     rgba(0, 0, 0, .4);
@sd-gray5:     rgba(0, 0, 0, .5);
@sd-gray6:     rgba(0, 0, 0, .6);
@sd-gray7:     rgba(0, 0, 0, .7);
@sd-gray8:     rgba(0, 0, 0, .8);
@sd-gray9:     rgba(0, 0, 0, .9);
@sd-light1:     rgba(255, 255, 255, .1);
@sd-light2:     rgba(255, 255, 255, .2);
@sd-light3:     rgba(255, 255, 255, .3);
@sd-light4:     rgba(255, 255, 255, .4);
@sd-light5:     rgba(255, 255, 255, .5);
@sd-light6:     rgba(255, 255, 255, .6);
@sd-light7:     rgba(255, 255, 255, .7);
@sd-light8:     rgba(255, 255, 255, .8);
@sd-light9:     rgba(255, 255, 255, .9);

//** 按钮颜色
// 按钮颜色-文字
@btn-yellow:            #ffc360;
@btn-red:               #f15f63;
@btn-green:             #65d3d3;
@btn-blue:              #6cf;

@btn-border:            #dcdfe6;

// 输入框
@input-border:          @grayD;
@input-border-focus:    rgba(0, 170, 255, .3);
@input-error:           red;
@input-error-shadow:    rgba(255, 0, 0, .2);
@input-focus:           #00aaff;
@input-focus-shadow:    rgba(0, 170, 255, .4);
@input-sus:             green;

// icon-color
@facebook:              #587bb4;
@twitter:               #75b5de;
@google:                #f15f63;
@wechat:                #64ab23;
@alipay:                #01aaef;
@bank:                #4800ff;
@qq:                    #1fb9e6;
@sina:                  #d0422b;

// keyword
@key-close-color:       @sd-light6;

//== Numerical
//
//## 页面全局用到的数值

// 全局宽度
@container:             1200px;
@e-container:             1260px;
@layout:                1200px;
@content:                750px;
@content:                750px;

//全局背景色
@global-bgcolor:#ededed;



//#################### 深色版颜色   ####################################################################################################

